// 分类模块
import { findHeadCategory } from '@/api/cate'
import { category } from '@/utils/constant'

export default {
  namespaced: true,
  state () {
    return {
      list: category.map((item, index) => ({ id: index, name: item }))
    }
  },
  mutations: {
    // 更新分类列表数据
    initList (state, payload) {
      state.list = payload
    }
  },
  actions: {
    // 调用接口获取分类的数据
    async loadCateList (context) {
      const ret = await findHeadCategory()
      if (ret.result) {
        // 获取分类列表成功
        context.commit('initList', ret.result)
      }
    }
  },
  // 用来控制首页左侧动态列表在已有的列表上计算新的列表
  getters: {
    leftCates (state) {
      // 此时需要保留两个二级分类
      // getters和计算属性中，不应该修改依赖的数据!!!
      return state.list.map(item => {
        // 第一种方法会影响 原始数据 因为直接修改的是item.children，return的还是原来的对象，但是此时item.children已经被修改了 ，所以才会导致左侧和头部的二级children都发生的变化
        // item.children = item.children && item.children.filter((item, index) => index < 2)
        // return item
        // 第二种写法 ：不会影响原始的数据。 return的是一个新对象 不是原始的 没有任何影响
        return {
          ...item,
          // children: item.children && item.children.filter((item, index) => index < 2)
          children: item.children && item.children.slice(0, 2)
        }
      })
    }
  }
}
